﻿@{
    ViewBag.Title = null;
}
<!DOCTYPE html>
<html>
<head>
 @if (false)
    {
        <script src="../../../../Scripts/jquery-vsdoc.js" type="text/javascript"></script>
        <script src="../../../../Scripts/ASPxScriptIntelliSense.js" type="text/javascript"></script>
    }
    <link href="@Url.Content("~/Content/Site.css", true)" rel="stylesheet" type="text/css" />

    <script src="@Url.Content("~/Scripts/jquery.min.js", true)" type="text/javascript"></script>

    <script src="@Url.Content("~/Scripts/FloatDiv.js", true)" type="text/javascript"></script>

    <script src="@Url.Content("~/Common/GetRootPath.ashx", true)" type="text/javascript"></script>

    <script src="@Url.Content("~/Scripts/json2.js", true)" type="text/javascript"></script>

     @Html.DevExpress().GetStyleSheets(

                new StyleSheet { ExtensionType = ExtensionType.GridView, Theme = DevExpressHelper.Theme }
    )
    @Html.DevExpress().GetScripts(
                    new Script { ExtensionType = ExtensionType.ListBox }
    )

    <script type="text/javascript">
        $(function () {
            var obj = window.dialogArguments;
            var json = $('#hidJson').val();
            if (json != "" && obj.Value != "") {
                //左边的IPselelct
                var dirList = JSON.parse(json);
                var objLbx = document.getElementById("leftListBoxCatalog");
                objLbx.options.length = 0;
                var nDefaultSelIndex = -1;

                var dirLists = JSON.parse(obj.Value);
                var objLbxs = document.getElementById("rightListBoxCatalog");
                objLbxs.options.length = 0;
                var nDefaultSelIndexs = -1;

                for (var i = 0; i < dirList.length; i++) {
                    var a = false;
                    for (var z = 0; z < dirLists.length; z++) {
                        if (dirList[i]["FIPGroupID"] == dirLists[z]["FIPGroupID"]) {
                            var newOptions = new Option(dirList[i]["StrFStartIP"] + "～" + dirList[i]["StrFEndIP"], dirList[i]["FIPGroupID"], false, false);
                            objLbxs.options.add(newOptions);
                            a = true;
                            break;
                        }
                    }
                    if (a == false) {
                        var newOption = new Option(dirList[i]["StrFStartIP"] + "～" + dirList[i]["StrFEndIP"], dirList[i]["FIPGroupID"], false, false);

                        objLbx.options.add(newOption);
                    }
                    objLbxs.selectedIndex = nDefaultSelIndexs;


                }
                objLbx.selectedIndex = nDefaultSelIndex;

            } else if (json != "") {
                var dirList = JSON.parse(json);
                var objLbx = document.getElementById("leftListBoxCatalog");
                objLbx.options.length = 0;
                var nDefaultSelIndex = -1;
                for (var i = 0; i < dirList.length; i++) {
                    var newOption = new Option(dirList[i]["StrFStartIP"] + "～" + dirList[i]["StrFEndIP"], dirList[i]["FIPGroupID"], false, false);

                    objLbx.options.add(newOption);

                }
                objLbx.selectedIndex = nDefaultSelIndex;
            }

            else if (json == "") {
                alert("目前没有可用的IP组！");
                return;
            }

            //右移双击
            $('#leftListBoxCatalog').dblclick(function () {
                var $options = $('option:selected', this);
                $options.appendTo('#rightListBoxCatalog');
            });

            //左移双击
            $('#rightListBoxCatalog').dblclick(function () {
                var $options = $('option:selected', this);
                $options.appendTo('#leftListBoxCatalog');
            });

        });
      

        function right() {
            var $options = $('#leftListBoxCatalog option:selected');
            if ($options.length <= 0) {
                alert("请选择右移的数据!");
            } else {
                $options.appendTo('#rightListBoxCatalog');
            }
         }

         function left() {
             var $options = $('#rightListBoxCatalog option:selected');
             if ($options.length <= 0) {
                 alert("请选择左移的数据!");
             } else {
                 $options.appendTo('#leftListBoxCatalog');
             }
         }

         function ok() {
             var strGroupIPNamesIDs = "";
             $('#rightListBoxCatalog option').each(function () {
                 strGroupIPNamesIDs += $(this).text() + "|" + $(this).val() + "|";
             });
             this.returnValue = strGroupIPNamesIDs;
             window.close();
             
         }
         function cancel() {
             window.close();

         }
         

    </script>

</head>
<body>
    <div>
        <table width="100%"  align="center" border="0" cellpadding="0" cellspacing="0" class="tableForm">
              <tr>
              <td align="center">可选IP</td>
              <td></td>
              <td align="center">参与IP</td>
              </tr> 
              <tr>
              <td valign="top" width="300">
              <select id="leftListBoxCatalog" name="leftListBoxCatalog" multiple="true" style="width: 280px; height:200px;">
                </select>
             
              </td>
              <td align="center" width="100">
               @Html.DevExpress().Button(settings =>
           {
               settings.Name = "btnRight";
               settings.Text = ">>";
               settings.Width = 50;
               //settings.ControlStyle.CssClass = "button";
               //settings.Images.Image.Url = Url.Content("~/Content/ControlImages/forward.png");
               settings.CausesValidation = false;
               settings.ClientSideEvents.Click = "right";
           }).GetHtml()
                                         
            <br /><br /> 
             @Html.DevExpress().Button(settings =>
           {
               settings.Name = "btnLeft";
               settings.Text = "<<";
               settings.Width = 50;
               //settings.ControlStyle.CssClass = "button";
               //settings.Images.Image.Url = Url.Content("~/Content/ControlImages/back.png");
               settings.CausesValidation = false;
               settings.ClientSideEvents.Click = "left";
           }).GetHtml()
         
         </td>

         <td valign="top"  width="300">                                      
              <select id="rightListBoxCatalog" name="rightListBoxCatalog" multiple="true" style="width: 280px; height:200px;">
                </select>
         </td>
         </tr>
             <tr>
             <td></td>
                <td class="tdClass" colspan="2">
                 @Html.DevExpress().Button(settings =>
            {
                settings.Name = "btnOK";
                settings.Text = "确定";
                settings.ControlStyle.CssClass = "button";
                settings.Images.Image.Url = Url.Content("~/Content/ControlImages/ok.png");
                settings.ClientSideEvents.Click = "function(){ok()}";
            }).GetHtml()
                
                @Html.DevExpress().Button(settings =>
           {
               settings.Name = "btnCancel";
               settings.Text = "取消";
               settings.ControlStyle.CssClass = "button";
               settings.Images.Image.Url = Url.Content("~/Content/ControlImages/no.png");
               settings.CausesValidation = false;
               settings.ClientSideEvents.Click = "cancel";
           }).GetHtml()

                </td>
            </tr>
        </table>
    </div>
   @Html.Hidden("hidJson", ViewData["groupIPList"])
   @Html.Hidden("hdIDs", ViewData["IDs"])
 


</body>
</html>